/* 
	UI Dialog Style
 */

.ui_dialog{ position: absolute; }
.ui_table_wrap{ position: relative; z-index: 10715; }
.ui_title_wrap, .ui_bottom button { font-size:12px 'Microsoft Yahei', Arial; }
.ui_content{ min-width:9em; position: relative; padding: 20px; }
.ui_border { background-color:#000;}
.ui_td_00, .ui_td_02, .ui_td_20, .ui_td_22 { width:8px; height:8px; }
.ui_overlay div {background:#000; filter:alpha(opacity=70); opacity:0.7; }
.ui_dialog_main { border: none; }
.ui_title { position:relative; height:100%; text-align: left; }
.ui_title_text {
	position: relative;
	z-index: 8;
	height: 30px;
	line-height: 30px;
	padding: 0 30px 0 10px;
	font-weight: 700;
	border-style: solid;
	border-width: 1px;
	background-color: #409DD6;
	color: #EBEBEB;
	border-color: #4E84C0 #4E84C0 #333 #4E84C0;
	box-shadow: inset 0 -2px 2px rgba(0, 0, 0, 0.2);
}
.ui_close {
	position: absolute;
	padding: 0;
	top: 10px;
	right: 8px;
	width: 9px;
	height: 9px;
	line-height: 10px;
	color: #FFF!important;
	text-indent: -9em;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	z-index: 9;
	background:url("ico_module.png");
}
.ui_close_ico_gray{background-position: -101px -56px;}
.ui_close_ico_red{background-position: -111px -56px;}
.ui_close_ico_black{background-position: -121px -56px;}
.ui_close_ico_white{background-position: -131px -56px;}
.ui_close_ico_orange{background-position: -141px -56px;}

.ui_button_box{
	border-top: 1px solid #EBEBEB;
	background-color: #F6F6F6;
}
.ui_btns {
	text-align: right;
}
.ui_resize {
	display: none;
	background:url("ico_module.png");
	background-position: -140px -82px;
	position: absolute;
	right: 12px;
	bottom: 12px;
	width: 10px;
	height: 10px;
	z-index: 870614;
	cursor: se-resize;
}
.ui_content { color:#666; background-color: #FFF; }
.ui_loading_tip { color:#808080; }

.ui_box_loading{
	position: absolute;
	left: 50%;
	top:50%;
	width: 28px;
	height: 28px;
	margin-left: -14px;
	margin-top: -14px;
}
.ui_box_error{
	width: 145px;
	line-height: 50px;
	padding: 20px 50px;
	color: #E84901;
}
.ui_botton{
	text-align: center;
}
.ui_box_btn,.ui_box_btn2{
	margin: 5px 10px 5px 0;
	width:74px;
	height:25px;
	line-height: 25px;
	vertical-align: middle;
	background: url(ico_module.png) 0px -30px no-repeat;
	border:none;
	font-size:12px;
	color:#fff;
}
.ui_box_btn2{ background-position: -76px -30px; }

.ui_btn_small,.ui_btn_small2{
	width:50px;
	height:25px;
	line-height: 25px;
	vertical-align: middle;
	background: url(ico_module.png) 0px -56px no-repeat;
	border:none;
	font-size:12px;
	color:#fff;
}
.ui_btn_small2{ background-position: -50px -56px; }
.ui_box_shadow{
	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
}
.ui_iframe{
	margin: 0; border: 0; overflow: hidden;
}

/* 
	UI CallBack Style
 */
.ui_box_callback{
	padding: 20px 30px;
	height: 50px;
	line-height: 50px;
}
.ui_box_callback_ok,
.ui_box_callback_error,
.ui_box_callback_tips{
	float: left;
	display: block;
	width: 46px;
	height: 50px;
	margin-right: 10px;
	display: inline;
	background: url(ico_module.png) 0 -220px no-repeat;
}
.ui_box_callback_tips{
	background-position: -50px -220px;
}
.ui_box_callback_error{
	background-position: -100px -220px;
}

/* 
	Validate Style
	2012-04-07
 */
.validate_inputText,
.theme_background_color_input{
	border: 1px solid #ccc;
	padding: 1px 0 0 2px;
	width: 255px;
	height: 21px;
	background: #fff url(ico_module.png) 0 -270px repeat-x;
}

.validate_tips_layer_ico_default,
.validate_tips_layer_ico_yes,
.validate_tips_layer_ico_error{
	float: left;
	width:12px;
	height:14px;
	display: block;
	margin: 2px 2px 0 0;
}
.validate_tips_layer_ico_default,
.ico_tips{
	background: url(ico_module.png) -101px -67px no-repeat;
}
.validate_tips_layer_ico_yes,
.ico_yes{
	background: url(ico_module.png) -114px -67px no-repeat;
}
.validate_tips_layer_ico_error,
.ico_error{
	background: url(ico_module.png) -127px -67px no-repeat;
}
.validate_tips_layer_content {
	float: left;
	line-height: 18px;
	font-style: normal;
}

/* 
	Tips Style
 */
.ui_arrow {
    position: absolute;
    z-index: 1001;
}

.ui_arrow em {
    color: #D1B07C;
    font-style: normal;
}
.nav-notice span {
    color: #FFFFDA;
    top: 2px;
}
.ui_arrow em, .ui_arrow span {
    font-family: Simsun;
    font-size: 16px;
    width: 17px;
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    position: absolute;
   
}

.ui_arrow_mode_left { left: -9px; }
.ui_arrow_mode_left span{left: 2px; }

.ui_arrow_mode_top { top: -10px; }
.ui_arrow_mode_top span{top: 2px;}

.ui_arrow_mode_right { right: -10px; }
.ui_arrow_mode_right em{right: 0;}
.ui_arrow_mode_right span{right: 2px;}

.ui_arrow_mode_bottom { bottom: -11px; _bottom: -13px; /* IE6 */ }
:root .ui_arrow_mode_bottom { bottom: -13px\9;/* IE9 */ }
.ui_arrow_mode_bottom em{bottom: 0;}
.ui_arrow_mode_bottom span{bottom: 2px;}

.ui_tips_style_default { border:1px solid #FF9900;background:#FFFFE3;padding:5px 8px;}
.ui_tips_style_default em{color: #FF9900;}
.ui_tips_style_default span{color: #FFFFE3;}

.ui_tips_style_blue { border:1px solid #A9C9E2;background:#E8F5FE;padding:5px 8px;}
.ui_tips_style_blue em{color: #A9C9E2;}
.ui_tips_style_blue span{color: #E8F5FE;}

.ui_tips_style_green{ border:1px solid #9BDF70;background:#F0FBEB;padding:5px 8px;}.
.ui_tips_style_green em{color: #9BDF70;}
.ui_tips_style_green span{color: #F0FBEB;}

.ui_tips_style_purple{border:1px solid #F8B3D0;background:#FFF5FA;padding:5px 8px;}
.ui_tips_style_purple em{color: #F8B3D0;}
.ui_tips_style_purple span{color: #FFF5FA;}

.ui_tips_style_gray{border:1px solid #D3D3D3;background:#F7F7F7;padding:5px 8px;}
.ui_tips_style_gray em{color: #D3D3D3;}
.ui_tips_style_gray span{color: #F7F7F7;}


.ico_tips,.ico_yes,.ico_error{
	float: left;
	width: 12px;
	height: 14px;
}



/* Themes */
.theme_tab{
	position: relative;
	width: 100%;
	height: 29px;
	line-height: 29px;
	border-top: 1px solid #CCCCCC;
	border-bottom: none;
	background: url(ico_module.png) 0 0 repeat-x;
	z-index: 199;
	overflow: hidden;
}
.theme_tab li{
	float: left;
	height: 29px;
	line-height: 29px;
	padding: 0 10px;
	border-right:1px solid #ccc;
	cursor: pointer;
}
.theme_tab li.current{
	background: url(ico_module.png) 0 -270px repeat-x;
	font-weight: bold;
}
.theme_style_box{
	border: 1px solid #ccc;
}
.theme_background_box{
	position: relative;
	width: 345px;
}
.theme_background_box_header{
	position: relative;
	height: 42px;
	background: #fff;
	padding: 8px;
	border: 1px solid #ccc;
}

.theme_background_box_header .validate_inputText,
.theme_background_box_header .inputSubmit,
.theme_background_img_box_border,
.theme_background_img_seting{
	float:left;
}
.theme_background_box_header .inputSubmit{
	margin-left: 8px;
	display: inline;
	font-size: 12px;
}
.theme_background_tips{
	clear: both;
	height: 18px;
	line-height: 22px;
	overflow: hidden;
}
.theme_background_img_wrap{
	position: relative;
	border: 1px solid #ccc;
	border-top: none;
	padding: 8px;
}
.theme_background_img_box_border {
	position: relative;
	border: 2px solid #80C1D7;
	padding: 3px;
	width: 150px;
	height: 100px;
}
.theme_background_img_box{
	width: 150px;
	height: 100px;
	background: url(background_default.png) no-repeat;
	overflow: hidden;
}

.theme_background_img_remove{
	display: block;
	position: absolute;
	right: 0px;
	top: 0px;
	width: 13px;
	height: 13px;
	text-indent: -9999em;
	overflow: hidden;
	background: url(ico_module.png) -115px -80px no-repeat;
}
.theme_background_img_seting {
	float: right;
	width: 150px;
	margin-left:10px;
	display: inline;
}
.theme_background_repeat{
	height:18px;
	line-height: 18px;
}
.theme_background_color {
	margin-top: 5px;
}
.theme_background_color_input {
	width: 50px;
}
.theme_background_position {
	width:123px;
	height: 28px;
	line-height: 28px;
	margin: 8px 0;
	border: 1px solid #999;
	border-right: none;
	background: #e84901;
	overflow: hidden;
}
.theme_background_position a {
	float: left;
	width: 40px;
	text-align: center;
	background: #fff;
	border-right: 1px solid #999;
}
.theme_background_position a.select{
	background: url(ico_module.png) 0 0 repeat-x;
	color:#000;
	border-right: 1px solid #666;
}
.theme_background_tips .ico_tips,
.theme_background_tips .ico_yes,
.theme_background_tips .ico_error{
	float: left;
	width:12px;
	height:14px;
	margin: 4px 3px 0 0;
	display: inline;
	overflow: hidden;
}

.theme_background_btn{ text-align: center; }


.cr{
	vertical-align: middle;
	margin-bottom:1px;
	margin-top:-2px;
}

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

.hide{ display: none; }
.z{ zoom: 1; }

/* CSS3 */
.text-shadow (@string: 0 1px 3px rgba(0, 0, 0, 0.25)) {
	text-shadow: @string;
}
.box-shadow (@string) {
	-webkit-box-shadow: @string;
	-moz-box-shadow:    @string;
	box-shadow:         @string;
}
.drop-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
	-webkit-box-shadow:	@x @y @blur @spread rgba(0, 0, 0, @alpha);
	-moz-box-shadow:	@x @y @blur @spread rgba(0, 0, 0, @alpha);
	box-shadow:		@x @y @blur @spread rgba(0, 0, 0, @alpha);
}
.inner-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
	-webkit-box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
	-moz-box-shadow:    inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
	box-shadow:         inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
}

.box-sizing (@type: border-box) {
	-webkit-box-sizing: @type;
	-moz-box-sizing:    @type;
	box-sizing:         @type;
}

.border-radius (@radius: 5px) {
	-webkit-border-radius: @radius;
	-moz-border-radius:    @radius;
	border-radius:         @radius;

	-moz-background-clip:    padding;
	-webkit-background-clip: padding-box;
	background-clip:         padding-box;
}
.border-radiuses (@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
	-webkit-border-top-right-radius:    @topright;
	-webkit-border-bottom-right-radius: @bottomright;
	-webkit-border-bottom-left-radius:  @bottomleft;
	-webkit-border-top-left-radius:     @topleft;

	-moz-border-radius-topright:        @topright;
	-moz-border-radius-bottomright:     @bottomright;
	-moz-border-radius-bottomleft:      @bottomleft;
	-moz-border-radius-topleft:         @topleft;

	border-top-right-radius:            @topright;
	border-bottom-right-radius:         @bottomright;
	border-bottom-left-radius:          @bottomleft;
	border-top-left-radius:             @topleft;

	-moz-background-clip:    padding;
	-webkit-background-clip: padding-box;
	background-clip:         padding-box;
}

.opacity (@opacity: 0.5) {
	-webkit-opacity: 	@opacity;
	-moz-opacity: 		@opacity;
	opacity: 		@opacity;
}

.gradient (@startColor: #eee, @endColor: white) {
	background-color: @startColor;
	background: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
	background: -webkit-linear-gradient(top, @startColor, @endColor);
	background: -moz-linear-gradient(top, @startColor, @endColor);
	background: -ms-linear-gradient(top, @startColor, @endColor);
	background: -o-linear-gradient(top, @startColor, @endColor);
}
.horizontal-gradient (@startColor: #eee, @endColor: white) {
 	background-color: @startColor;
	background-image: -webkit-gradient(linear, left top, right top, from(@startColor), to(@endColor));
	background-image: -webkit-linear-gradient(left, @startColor, @endColor);
	background-image: -moz-linear-gradient(left, @startColor, @endColor);
	background-image: -ms-linear-gradient(left, @startColor, @endColor);
	background-image: -o-linear-gradient(left, @startColor, @endColor);
}

.animation (@name, @duration: 300ms, @delay: 0, @ease: ease) {
	-webkit-animation: @name @duration @delay @ease;
	-moz-animation:    @name @duration @delay @ease;
	-ms-animation:     @name @duration @delay @ease;
}

.transition (@transition) {
	-webkit-transition: @transition;
	-moz-transition:    @transition;
	-ms-transition:     @transition;
	-o-transition:      @transition;
}
.transform(@string){
	-webkit-transform: @string;
	-moz-transform: 	 @string;
	-ms-transform: 		 @string;
	-o-transform: 		 @string;
}
.scale (@factor) {
	-webkit-transform: scale(@factor);
	-moz-transform: 	 scale(@factor);
	-ms-transform: 		 scale(@factor);
	-o-transform: 		 scale(@factor);
}
.rotate (@deg) {
	-webkit-transform: rotate(@deg);
	-moz-transform: 	 rotate(@deg);
	-ms-transform: 		 rotate(@deg);
	-o-transform: 		 rotate(@deg);
}
.skew (@deg, @deg2) {
	-webkit-transform:       skew(@deg, @deg2);
	-moz-transform: 	 skew(@deg, @deg2);
	-ms-transform: 		 skew(@deg, @deg2);
	-o-transform: 		 skew(@deg, @deg2);
}
.translate (@x, @y:0) {
	-webkit-transform:       translate(@x, @y);
	-moz-transform: 	 translate(@x, @y);
	-ms-transform: 		 translate(@x, @y);
	-o-transform: 		 translate(@x, @y);
}
.translate3d (@x, @y: 0, @z: 0) {
	-webkit-transform:       translate3d(@x, @y, @z);
	-moz-transform: 	 translate3d(@x, @y, @z);
	-ms-transform: 		 translate3d(@x, @y, @z);
	-o-transform: 		 translate3d(@x, @y, @z);
}
.perspective (@value: 1000) {
	-webkit-perspective: 	@value;
	-moz-perspective: 	@value;
	-ms-perspective: 	@value;
	perspective: 		@value;
}
.transform-origin (@x:center, @y:center) {
	-webkit-transform-origin: @x @y;
	-moz-transform-origin:    @x @y;
	-ms-transform-origin:     @x @y;
	-o-transform-origin:      @x @y;
}
@font-face {
	font-family: 'MyWebFont';
	src: url('webfont.eot'); /* IE9 Compat Modes */
	src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('webfont.woff') format('woff'), /* Modern Browsers */
	     url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
	     url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
	}

#test {   
        width:300px;   
        height:300px;   
          
        background-color:blue;      /*firefox*/
        background-color:red\9;      /*all ie*/
        background-color:yellow\0;    /*ie8*/
        +background-color:pink;        /*ie7*/
        _background-color:orange;       /*ie6*/
    }  
    :root #test { background-color:purple\9; }  /*ie9*/
    @media all and (min-width:0px){ #test {background-color:black\0;} }  /*opera*/
    @media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }  /*chrome and safari*/


